<template>
    <page-header-wrapper>
        <a-card :bordered="false">
            <div class="table-page-search-wrapper">
                <s-table :loading="loading" :cols="cols" :data="data" :actions="acts"
                         :operators="[{type: 'primary', icon: 'plus', title: '新建', selection: false, func: add}]"/>
                <r-form :title="member.title" :visible="member.visible" :loading="member.loading"
                        :fields="member.fields" :model="member.model" @ok="addOk"
                        @cancel="member.visible = member.loading = false"/>
                <a-form :visible="auth.visible" :loading="auth.loading" :model="auth.model"
                        @ok="authOk" @cancel="auth.visible = auth.loading = false"/>
            </div>
        </a-card>
    </page-header-wrapper>
</template>

<script>
    import STable from '@/components/Table/PagerTable'
    import RForm from '@/components/Forms/RecordForm'
    import AForm from './modal/AuthForm'
    import API from "@/api"
    import {Modal} from "ant-design-vue"

    export default {
        components: {
            STable,
            RForm,
            AForm
        },
        data() {
            return {
                loading: true,
                data: [],
                cols: [{title: '工号', key: 'number', search: true},
                    {title: '名字', key: 'name', search: true},
                    {title: '职位', key: 'title', search: true},
                    {title: '手机', key: 'phone', search: true},
                    {title: '身份', key: 'state', search: true}],
                acts: [{func: this.edit, title: '编辑'},
                    {func: this.authUser, title: '权限'}, {func: this.reset, title: '重置密码'}],

                member: {
                    title: '',
                    visible: false,
                    loading: false,
                    fields: [{title: '工号', key: 'number', rules: [
                        { required: true, message: '请输入工号', trigger: 'blur' },
                            { max: 20, message: '工号过长', trigger: 'blur' }]},
                        {title: '名字', key: 'name', rules: [
                        { required: true, message: '请输入名字', trigger: 'blur' },
                            { max: 5, message: '名字过长', trigger: 'blur' }]},
                        {title: '职位', key: 'title', rules: [
                            { required: true, message: '请输入职位', trigger: 'blur' },
                                { max: 10, message: '职位过长', trigger: 'blur' }]},
                        {title: '手机', key: 'phone', rules: [
                                { required: true, message: '请输入手机', trigger: 'blur' },
                                { max: 20, message: '手机过长', trigger: 'blur' }]}
                                ],
                    model: {}
                },
                auth: {
                    visible: false,
                    loading: false,
                    model: {}
                },
                states: ['停用', '人事处', '院领导', '系主任', '管理员']
            }
        },
        mounted() {
            API.User.List().then((res) => {
                if (res) {
                    this.data = res.data
                    this.data.forEach(item => {
                        item.key = item.id.toString()
                        item.state = this.states[item.status]
                    })
                }
            }).finally(() => this.loading = false)
        },
        methods: {
            add() {
                this.member.title = '添加成员'
                this.member.model = null
                this.member.visible = true
            },
            edit(record) {
                this.member.title = '编辑成员'
                this.member.model = record
                this.member.visible = true
            },
            authUser(record) {
                if (record.status === 4) {
                    this.$notification.warn({message: '提示', description: '无法为管理员授权'})
                    return
                }
                this.auth.visible = this.auth.loading = true
                API.User.GetAuth({id: record.id}).then((res) => {
                    if (res) {
                        if (!res.data.positions) res.data.positions = []
                        res.data.id = record.id
                        this.auth.model = res.data
                    }
                    else this.auth.visible = false
                }).finally(() => this.auth.loading = false)
            },
            reset(record) {
                Modal.confirm({
                    title: '提示',
                    content: '是否确认重置密码？',
                    onOk: () => {
                        API.User.ResetPassword({id: record.id}).then((res) => {
                            if (res) this.$notification.success({message: '提示', description: '已重置未初始密码: ' + res.data})
                        })
                    },
                    onCancel () {}
                })
            },
            addOk(params) {
                this.member.loading = true
                if (params.id) {
                    API.User.Edit(params).then((data) => this.addProcessor(data, params))
                        .finally(() => this.member.loading = false)
                }
                else {
                    API.User.Add(params).then((data) => this.addProcessor(data, params))
                        .finally(() => this.member.loading = false)
                }
            },
            addProcessor(res, params) {
                if (res) {
                    this.member.visible = false
                    if (params.id) {
                        for (let i = 0; i < this.data.length; i++) {
                            let item = this.data[i]
                            if (item.id === params.id) {
                                item.name = params.name
                                item.number = params.number
                                item.title = params.title
                                item.phone = params.phone
                                break
                            }
                        }
                        this.$notification.success({message: '提示', description: '用户资料修改成功'})
                    }
                    else {
                        params.id = res.data
                        params.key = params.id.toString()
                        params.status = 3
                        params.state = this.states[3]
                        this.data.push(params)
                        this.$notification.success({message: '提示', description: '添加用户成功'})
                    }
                }
            },
            authOk(params) {
                this.auth.loading = true
                API.User.SetAuth(params).then(res => {
                    if (res) {
                        for (let i = 0; i < this.data.length; i++) {
                            let item = this.data[i]
                            if (item.id === params.id) {
                                item.status = params.status
                                item.state = this.states[item.status]
                                break
                            }
                        }
                        this.$notification.success({message: '提示', description: '授权成功'})
                        this.auth.visible = false
                    }
                }).finally(() => this.auth.loading = false)
            }
        }
    }
</script>
